<template>
	<n-config-provider
		:theme-overrides="themeOverrides"
		:locale="zhCN"
		:date-locale="dateZhCN"
		:theme="theme"
		abstract
	>
		<n-message-provider>
			<n-dialog-provider>
				<router-view />
			</n-dialog-provider>
		</n-message-provider>
	</n-config-provider>
</template>

<script setup>
import { ref } from 'vue';
import { zhCN, dateZhCN, darkTheme } from 'naive-ui';
const theme = ref(null);
const themeOverrides = {
	common: {
		primaryColor: '#1D6FE9',
		primaryColorHover: '#1D6FE9',
		primaryColorPressed: '#1D6FE9',
		primaryColorSuppl: '#1D6FE9',
		heightMedium: '32px'
	},
	Button: {
		outline: 0
	},
	Form: {
		blankHeightMedium: '32px'
	},
	DataTable: {
		thColor: '#f5f5f5'
	},
	Pagination: {
		itemBorder: '1px solid rgba(0, 0, 0, 0.12)',
		itemBorderHover: '1px solid #1D6FE9'
	}
};
</script>

<style lang="less">
html,
body,
#root {
	width: 100%;
	height: 100%;
	overflow: hidden;
	box-sizing: border-box;
}

.n-data-table {
	.n-data-table-th {
		&.Tooltip {
			span {
				cursor: pointer;
				&::after {
					content: '?';
					position: relative;
					bottom: 0px;
					display: inline-block;
					text-align: center;
					font-size: 16px;
					color: #fff;
					width: 28px;
					line-height: 28px;
					transform: scale(0.5);
					background: #999999;
					border-radius: 50%;
				}
			}
		}
	}
}
</style>
